<template>
	<view class=" block">
		<view class="">
			<view class="flexbetween mainpadding ffffff xiahuaxian">
				<view class="flexleft">
					<image class="touxiang margin_right1" src="../static/image/system/vs.png" mode=""></image>
					<view class="">
						<view class="ershiba xiaohei">我与石榴共白头</view>
						<view class="smalltext xiaohui margin_top1">6小时前</view>
					</view>
				</view>
				<view class="flexcenter guaznbtn">
					<view class="margin_right1">
						<u-icon name="plus" color="#fff" size="12"></u-icon>
					</view>
					<view class="">关注</view>
				</view>
			</view>
			<view class="ffffff mainpadding ">
				<view class="bigtext fonweight textcenter">关自由散漫的凉风能治愈乱糟糟的坏心情注</view>
				<image class="tupian margin_top" src="../static/image/system/zybjt.png" mode=""></image>
			</view>
			<!-- 评价 -->
			<view class="ffffff mainpadding margin_top2">
				<view class="sanshier fonweight">全部评论</view>
				<view class="flextop margin_top" v-for="item in 3">
					<image class="pltx" src="../static/image/system/nans.png" mode=""></image>
					<view class="xiahuaxian" style="width: 88%;">
						<view class="strongtext xiaohui">细致的娜美</view>
						<view class="flexleft margin_top1">
							<view class="ershiba margin_right1">天边的风景美了眼,醉了心。</view>
							<view class="ershiba xiaohui">8小时前</view>
						</view>
						<view class="flextop margin_top">
							<image class="plxtx" src="../static/image/system/nans.png" mode=""></image>
							<view class="" style="width: 92%;">
								<view class="strongtext xiaohui">细致的娜美</view>
								<view class="flexleft margin_top1">
									<view class="ershiba margin_right1">天边的风景美了眼,醉了心。</view>
									<view class="ershiba xiaohui">8小时前</view>
								</view>
							</view>
						</view>
					</view>
				</view>
			</view>
		</view>
		<!-- 固定底部 -->
		<view class="gudingdb ffffff mainpadding flexbetween">
			<view class="shurbox flexleft">
				<image class="dbtx" src="../static/image/system/nans.png" mode=""></image>
				<input type="text" placeholder="友善评论，文明发言">
			</view>
			<view class="flexright">
				<view class="margin_right3">
					<view class="dticon">
						<image src="../static/image/system/dzs.png" mode=""></image>
					</view>
					<view class="smalltext textcenter">8</view>
				</view>
				<view class="margin_right3">
					<view class="dticon">
						<image src="../static/image/system/xx.png" mode=""></image>
					</view>
					<view class="smalltext textcenter">8</view>
				</view>
				<view class="margin_right3">
					<view class="dticon">
						<image src="../static/image/system/fx.png" mode=""></image>
					</view>
					<view class="smalltext textcenter">8</view>
				</view>
				<view class="">
					<view class="dticon">
						<image src="../static/image/system/s.png" mode=""></image>
					</view>
					<view class="smalltext textcenter">8</view>
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {

			}
		},
		methods: {

		}
	}
</script>

<style lang="scss" scoped>
	.dticon {
		width: 48rpx;
		height: 48rpx;

		image {
			width: 100%;
			height: 100%;
		}
	}

	.shurbox {
		background: #F4F4FC;
		border-radius: 32rpx;
	}

	.dbtx {
		width: 56rpx;
		height: 56rpx;
		border-radius: 50%;
	}

	.plxtx {
		width: 40rpx;
		height: 40rpx;
		border-radius: 50%;
	}

	.pltx {
		width: 70rpx;
		height: 70rpx;
		border-radius: 50%;
	}

	.tupian {
		width: 686rpx;
		height: 1220rpx;
	}

	.block {
		background: #F9F9F9;
		min-height: calc(100vh - 100rpx);
		height: auto;
	}

	.guaznbtn {
		font-size: 24rpx;
		font-family: PingFang SC;
		font-weight: bold;
		color: #FFFFFF;
		width: 138rpx;
		height: 64rpx;
		background: #2361FF;
		border-radius: 32rpx;
	}

	.touxiang {
		width: 64rpx;
		height: 64rpx;
		border-radius: 50%;
	}
</style>